<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>成为采买员</title>
    <link rel="stylesheet" type="text/css" href="../js/cube-ui/cube.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/buyer201905251740.css">
    <link rel="stylesheet" type="text/css" href="../css/component/choiceAddress.css"/>
    <link rel="stylesheet" type="text/css" href="../css/component/choiceMarket.css"/>
</head>

<body>
    <div class="app-shell" id="buyer" v-cloak>
        <div class="buyer-main">
            <div class="buyer-header">
                <i class="buyer-goback" @click="goback()">返回</i>成为采买员
            </div>

            <div class="buyer-container">
                    <ul>
                        <li class="buyer-listLi"><span class="buyer-listLiLeft">姓名：</span><input type="text" v-model="params.realName" placeholder="请输入您的姓名" class="buyer-listInput"></li>
                        <li class="buyer-listLi"><span class="buyer-listLiLeft">电话：</span><input type="number" v-model="params.mobile" placeholder="请输入您的电话" class="buyer-listInput"></li>
                        <li class="buyer-listLi">
                                <span class="buyer-listLiLeft">小区住址：</span>
                                <div class="buyer-housingEstateBox" @click="showAddress" v-if="fullAddress">
                                    <div class="buyer-houseEstate">{{housingEstate}}</div>
                                    <div class="buyer-fullAddress">{{fullAddress}}</div>
                                </div>
                                <div class="buyer-housingEstate" @click="showAddress" v-else>{{housingEstate}}</div>
                            </li>
                        <li class="buyer-listLi"><span class="buyer-listLiLeft">详细住址：</span><input type="text" v-model="address" placeholder="请输入您的详细住址" class="buyer-listInput"></li>
                        <li class="buyer-listLi"><span class="buyer-listLiLeft">采买超市：</span><div class="buyer-marketName" :class="{'buyer-divPlaceholder': supermarketName === '选择地址决定超市'}" @click="showMarket">{{supermarketName}}</div><!-- <input type="text" v-model="supermarketName" placeholder="选择地址决定超市" readonly class="buyer-listInput" @click="getSupermarket()"> --></li>
                    </ul>
                    <div class="buyer-card">
                        <h3 class="buyer-cardH3">身份证正面</h3>
                        <h5 class="buyer-cardH5">在有效期内，字迹清晰，没有遮挡、涂抹</h5>
                        <div id="idcard1" class="buyer-idcard">
                            <img :src="idcardFront" v-if="idcardFront" class="buyer-idcardImg">
                            <input class="buyer-idcardInput" @change="showIdCardFront($event)" ref="idcardFrontFile" type="file"
                                accept="image/*" capture="camera">
                        </div>
                    </div>
                    <div class="buyer-card">
                        <h3 class="buyer-cardH3">身份证反面</h3>
                        <h5 class="buyer-cardH5">在有效期内，字迹清晰，没有遮挡、涂抹</h5>
                        <div id="idcard2" class="buyer-idcard">
                            <img :src="idcardBack" v-if="idcardBack" class="buyer-idcardImg">
                            <input class="buyer-idcardInput" @change="showIdCardBack($event)" ref="idcardBackFile" type="file"
                                accept="image/*" capture="camera">
                        </div>
                    </div>
                    <cube-button :primary="true" :disabled="btnDisabled" class="buyer-submit" @click="sumbit()"><cube-loading v-if="btnDisabled"></cube-loading>提交审核</cube-button>
            </div>

            <choice-address :isaddress="showAdd" @change="changeShow" @choice="setHouseEstate"></choice-address>
            <choice-market :ismarket="isMarket" @changemarket="changeMarket" @choicemarket="setMarket"></choice-market>

            <!-- <cube-popup type="my-popup" position="bottom" ref="myPopup4">
                <div class="pop-cont">
                    <div class="region-tab">
                        <span
                        v-for="(item,index) in regions"
                        :key="index"
                        :class="{active:index==curIndex}"
                        @click="changeTab(index)">{{item.name}}</span>
                        <div class="pop-close" @click="close">
                            <a>
                                <i class="image-icons iconfont icon-close"></i>
                            </a>
                        </div>
                    </div>
                    <div class="region-list">
                        <dl class="rl1">
                        <dd
                            v-for="list in curList"
                            :key="list.id"
                            @click="select(list)">{{list.name}}</dd>
                        </dl>
                    </div>
                </div>
            </cube-popup>

            <cube-popup type="my-popup" position="bottom" ref="changeMarket">
                    <div class="pop-cont">
                        <div class="region-tab">
                            <span
                            v-for="(item,index) in regions"
                            :key="index"
                            :class="{active:index==curIndex}"
                            @click="changeTab(index)">{{item.name}}</span>
                            <div class="pop-close" @click="close">
                                <a>
                                    <i class="image-icons iconfont icon-close"></i>
                                </a>
                            </div>
                        </div>
                        <div class="region-list">
                            <dl class="rl1">
                            <dd
                                v-for="list in curList"
                                :key="list.id"
                                @click="changeMarket(list)">{{list.name}}</dd>
                            </dl>
                        </div>
                    </div>
                </cube-popup>

            <cube-popup type="my-popup" position="bottom" ref="supermarket">
                <div class="pop-cont">
                    <div class="region-tab">
                        <div class="region-title">选择你负责采买的超市</div>
                        <div class="pop-close" @click="closeSupermarket">
                            <a>
                                <i class="image-icons iconfont icon-close"></i>
                            </a>
                        </div>
                    </div>
                    <div class="region-list">
                        <dl class="rl1">
                        <dd
                            v-for="list in supermarketList"
                            :key="list.id"
                            @click="choiceSupermarket(list)">{{list.name}}</dd>
                        </dl>
                    </div>
                </div>
            </cube-popup> -->
        </div>
    </div>
    <script src="../js/vue.js"></script>
    <script src="../js/axios.min.js"></script>
    <script src="../js/fetch20190612.js"></script>
    <script src="../js/rem.js"></script>
    <script src="../js/cube-ui/cube.min.js"></script>
    <script src="../js/component/choiceAddress.js"></script>
    <script src="../js/component/choiceMarket.js"></script>
    <script src="js/member_info_buyer201905251100.js"></script>
</body>
</html>
